;(function(){
    const template = `<div>
    <!--头部导航区域-->
    <app-navbar></app-navbar>

    <!--核心区域:分左右两边-->
    <div class="container-fluid">
      <div class="row">

        <!--左边菜单栏区域-->
        <app-leaf></app-leaf>

        <!--右边主页面区域: 分上下两个区域
        <app-home>
          <h1 slot="dashboard" class="page-header">{{title}}</h1>
        </app-home>
        -->

        <!-- 配置路由渲染组件出口 添加<keep-alive> 缓存路由，及时性低的业务-->
        <keep-alive>
          <router-view>
            <!-- slot 插槽使用-->
            <h1 slot="dashboard" class="page-header">{{title}}</h1>
          </router-view>
        </keep-alive>
      </div>
    </div>
  </div>`

  window.App = {
      template,
      data() {
          return {
              title:'仪表盘'
          }
      },
      components:{
        'app-navbar': AppNavbar,
        'app-leaf': AppLeaf,
        'app-home': AppHome
      }
  }
})()